<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/content/variable.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1" name="viewport" />
<meta content="" name="description" />
<meta content="" name="author" />
<%@ include file="/content/head.jsp"%>
</head>
<body>
	<section class="content-header">
		<h1>
			秘约管理 <small>秘约内容</small>
		</h1>
	</section>
	<!-- Main content -->
	<section class="content">

		<div class="row">
			<!-- BEGIN SAMPLE TABLE PORTLET-->
			<div class="col-md-12">
				<!-- BEGIN SAMPLE TABLE PORTLET-->
				<div class="box-body" style="padding-bottom: 0px;">
					<div id="toolbar" class="btn-group">
						<button id="btn_add" type="button" onclick="addInfo()" class="btn btn-default create">
							<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
						</button>
					</div>
					<!--展示页面 -->
					<div class="table-scrollable">
						<table id="tb_departments" class="table-scrollable table table-hover" ></table>
					</div>
				</div>
			</div>
		</div>
	</section>
	
<%@ include file="/content/js.jsp"%>
</body>
<script>
	//查询按钮
	function refresh() {
		$('#tb_departments').bootstrapTable('refresh', {url: '<%=path %>/appointment/appointmentList'});
	}	
	//新增弹出子窗口
    function addInfo() {
        modalOpen({
            id: "Form",
            title:'新增内容',
            url: '<%=path%>/appointment/addAppointment_jump',
            width: "700px",
            height: "650px",
        });
    }
	
	//修改子页面
    function alertInfo(id) {
        modalOpen({
            id: "Form",
            title:'修改内容',
            url: '<%=path%>/appointment/alertAppointment?id='+id,
            width: "700px",
            height: "650px",
        });
    }
	
	//删除
    function deleteInfo(id) {
        layer.msg('是否确认删除？', {
      	  time: 0 //不自动关闭
      	  ,btn: ['确认', '取消']
      	  ,yes: function(index){
      		layer.close(index);
      	  	$.ajax({
              	type: "POST",
             	 async:false,
             	 url: "<%=path %>/appointment/deleteAppointment",
             	 data: {id: id},
             	 dataType: "json",
             	 success: function(data){
                	  if(data.missage=="success"){
                		  layer.msg('删除成功');
                	  }else{
                		  layer.msg('删除失败');
                	  }
                	  RefreshFather();
               	   }
              });
      	  }
      	});
    }
	
	//刷新父页面
	function RefreshFather(){
		$('#tb_departments').bootstrapTable(  
		        "refresh",  
		        {  
		            url:"<%=path %>/appointment/appointmentList" 
		        }  
		); 
	}
    
	$(function() {
		//1.初始化Table
		var oTable = new TableInit();
		oTable.Init();
		//2.初始化Button的点击事件
		var oButtonInit = new ButtonInit();
		oButtonInit.Init();
	});

	var TableInit = function() {
		var oTableInit = new Object();
		//初始化Table
		oTableInit.Init = function() {
			$('#tb_departments').bootstrapTable({
				url : '<%=path %>/appointment/appointmentList', //请求后台的URL（*）
				method : 'get', //请求方式（*）
				toolbar : '#toolbar', //工具按钮用哪个容器
				striped : true, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				pagination : true, //是否显示分页（*）
				sortable : false, //是否启用排序
				sortOrder : "asc", //排序方式
				queryParams : oTableInit.queryParams,//传递参数（*）
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList : [ 10, 25, 50, 100 ], //可供选择的每页的行数（*）
				search : true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
				strictSearch : true,
				showColumns : true, //是否显示所有的列
				showRefresh : true, //是否显示刷新按钮
				minimumCountColumns : 2, //最少允许的列数
				clickToSelect : true, //是否启用点击选中行
// 				height : 500, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
				uniqueId : "id", //每一行的唯一标识，一般为主键列
				showToggle : true, //是否显示详细视图和列表视图的切换按钮
				cardView : false, //是否显示详细视图
				detailView : false, //是否显示父子表
				rowStyle:function(row,index) {
			        var classes = ['active', 'success', 'info', 'warning', 'danger'];

			        if (index % 2 === 0 && index / 2 < classes.length) {
			            return {
			                classes: classes[index / 2]
			            };
			        }
			        return {};
				},
				columns : [ {
					checkbox : true
				}, {
					field : 'id',
					title : 'Id'
				}, {
					field : 'name',
					title : '名字'
				},  {
					field : 'weChat',
					title : '微信'
				},  {
					field : 'seeNumber',
					title : '查看人数'
				},  {
					field : 'city',
					title : '城市'
				},  {
					field : 'tags',
					title : '标签'
				}, {
					field : 'avatar',
					title : '头像',
					formatter:function(value,row){			
						return "<img src="+row.avatar+"  width='100' height='100'>";
					}
				}, {
					title : '操作',
					formatter:function(value,row){
						return  '<a href="javascript:alertInfo('+row.id+');" class="btn btn-icon-only purple mod"><i class="fa fa-edit mod"></i></a>'+
								'<a href="javascript:deleteInfo('+row.id+');" class="btn btn-icon-only red"> <i class="fa fa-times"></i></a>';
					}
				}, ]
			});
		};

		//得到查询的参数
		oTableInit.queryParams = function(params) {
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				limit : params.limit, //页面大小
				offset : params.offset, //页码
				departmentname : $("#txt_search_departmentname").val(),
				statu : $("#txt_search_statu").val()
			};
			return temp;
		};
		return oTableInit;
	};

	var ButtonInit = function() {
		var oInit = new Object();
		var postdata = {};
		oInit.Init = function() {
			//初始化页面上面的按钮事件
		};
		return oInit;
	};
</script>
</html>